﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Register_Page1.aspx.cs" Inherits="TCDC_System.Register.Register1" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>TCDC Regester</title>
    <link href="../Attribute/stylesheet/register-styles.css" rel="stylesheet" type="text/css" />
    <link href="../Attribute/jquery/css/smoothness/jquery-ui-1.8.20.custom.css" rel="stylesheet"
        type="text/css" />
    <script src="../Attribute/jquery/js/jquery-1.4.4.min.js" type="text/javascript"></script>
    <script src="../Attribute/jquery/js/jquery-ui-1.8.10.offset.datepicker.min.js" type="text/javascript"></script>
    <script src="../Attribute/jquery/jquery.validate.js" type="text/javascript"></script>
    <script type="text/javascript">
			var $i = jQuery.noConflict();//set for $ is $j of JQUERY
		   $i(function () {
		    var d = new Date();
		    var toDay = d.getDate() + '/' + (d.getMonth() + 1) + '/' + (d.getFullYear() + 543);
		    $i("#birthday").datepicker({ changeMonth: true, changeYear: true, yearRange: '-50:-5',dateFormat: 'dd/mm/yy', isBuddhist: true,
		      buttonImage: 'images/calendar.gif', 
			  defaultDate: toDay, 
			  dayNames: ['อาทิตย์', 'จันทร์', 'อังคาร', 'พุธ', 'พฤหัสบดี', 'ศุกร์', 'เสาร์'],
              dayNamesMin: ['อา.','จ.','อ.','พ.','พฤ.','ศ.','ส.'],
              monthNames: ['มกราคม','กุมภาพันธ์','มีนาคม','เมษายน','พฤษภาคม','มิถุนายน','กรกฎาคม','สิงหาคม','กันยายน','ตุลาคม','พฤศจิกายน','ธันวาคม'],
              monthNamesShort: ['ม.ค.','ก.พ.','มี.ค.','เม.ย.','พ.ค.','มิ.ย.','ก.ค.','ส.ค.','ก.ย.','ต.ค.','พ.ย.','ธ.ค.'],
			  });
			});		
    </script>
    <script src="../Attribute/jquery/s3Slider.js" type="text/javascript"></script>
    <script type="text/javascript">
        var $j = jQuery.noConflict(); //set for $ is $j of JQUERY
        $j(document).ready(function () {
            $j('#slider1').s3Slider({
                timeOut: 4000
            });

            $("#next").click(function () {
                //window.location = "Register_Page2.aspx";
                $("#register").submit();
            });

            

        });
    </script>
</head>
<body>
    <div id="wrap">
        <div id="logo">
        </div>
        <div id="header">
            <div id="slider1">
                <ul id="slider1Content">
                    <li class="slider1Image"><a href="">
                        <img src="../Attribute/images/register/h1.jpg" alt="1" border="0" /></a> <span class="left"><strong>TCDC</strong><br />
                            (Thailand Creative & Design Center)</span></li>
                    <li class="slider1Image"><a href="">
                        <img src="../Attribute/images/register/h2.jpg" alt="2" border="0" /></a> <span class="left"><strong>TCDC</strong><br />
                            (Thailand Creative & Design Center)</span></li>
                    <li class="slider1Image"><a href="">
                        <img src="../Attribute/images/register/h3.jpg" alt="3" border="0" /></a> <span class="left"><strong>TCDC</strong><br />
                            (Thailand Creative & Design Center)</span></li>
                    <div class="clear slider1Image">
                    </div>
                </ul>
            </div>
        </div>
        <ul id="tabs">
            <li><a id="current" href="#" name="#tab1">1. เลือก Campaign</a></li>
            <li><a href="#" name="#tab2">2. ข้อมูลเบื้องต้น</a></li>
            <li><a href="#" name="#tab3">3. ข้อมูลจำเพาะ</a></li>
            <li><a href="#" name="#tab4">4. ข้อมูลเกี่ยวกับการทำงาน</a></li>
        </ul>
        <form id="register" runat="server">
        <div id="content">
            <div id="tab1">
                <fieldset>
                    <legend>เลือก Compaign</legend>
                    <ol>
                        <li>
                            <label>
                                Select Campaign Type</label>
                            <asp:DropDownList ID="dlType" runat="server" AutoPostBack="True" 
                                onselectedindexchanged="dlType_SelectedIndexChanged">
                            </asp:DropDownList>
                            <asp:RequiredFieldValidator ID="RFType" runat="server" 
                                ErrorMessage="*** Required" ControlToValidate="dlType" ForeColor="Red"></asp:RequiredFieldValidator>
                        </li>
                        <li>
                            <label>
                                Select Campaign Group</label>
                            <asp:DropDownList ID="dlGroup" runat="server" AutoPostBack="True" 
                                onselectedindexchanged="dlGroup_SelectedIndexChanged">
                            </asp:DropDownList>
                            <asp:RequiredFieldValidator ID="RFGroup" runat="server" 
                                ControlToValidate="dlGroup" ErrorMessage="*** Required" ForeColor="Red"></asp:RequiredFieldValidator>
                        </li>
                        <li>
                            <label>
                                Select Campaign</label>
                            <asp:DropDownList ID="dlCampaign" runat="server" AutoPostBack="True">
                            </asp:DropDownList>
                            
                            <asp:RequiredFieldValidator ID="RFCampaign" runat="server" 
                                ControlToValidate="dlCampaign" ErrorMessage="*** Required" ForeColor="Red"></asp:RequiredFieldValidator>
                            
                        </li>

                    </ol>
                </fieldset>
                <fieldset>
                    <legend>TCDC Password</legend>
                    <ol>
                        <li>
                            <label for="email">
                                Email</label>
                            <asp:TextBox ID="txtEmail" runat="server" placeholder="example@domain.com"></asp:TextBox>
                            <asp:RequiredFieldValidator ID="RFEmail" runat="server" 
                                ControlToValidate="txtEmail" ErrorMessage="*** Required" ForeColor="Red"></asp:RequiredFieldValidator>
                        </li>
                        <li>
                            <label for="phone">
                                Password</label>
                            <asp:TextBox ID="txtPassword" runat="server" TextMode="Password"></asp:TextBox>
                            <asp:RequiredFieldValidator ID="RFPassword" runat="server" BorderStyle="None" 
                                ControlToValidate="txtPassword" ErrorMessage="*** Required" ForeColor="Red"></asp:RequiredFieldValidator>
                        </li>
                        <li>
                            <label for="phone">
                                Confirm Password</label>
                            <asp:TextBox ID="txtRePassword" runat="server" TextMode="Password"></asp:TextBox>
                            <asp:CompareValidator ID="CompareValidator1" runat="server" 
                                ControlToCompare="txtPassword" ControlToValidate="txtRePassword" 
                                ErrorMessage="CompareValidator" ForeColor="Red"></asp:CompareValidator>
                        </li>
                    </ol>
                </fieldset>
                <div align="center">
                    <fieldset for="nobor"><%--
                        <button type="submit" id="next">
                            Next</button>--%>
                        <asp:Button ID="txtNext" runat="server" Text="Next" onclick="txtNext_Click"  />
                    </fieldset>
                </div>
            </div>
            <div id="tab2">

            </div>
            <div id="tab3">
                
            </div>
            <div id="tab4">
                
            </div>
    </div>
    </form>
    <p id="footer">
        ©2013 Thailand Creative & Design Center. All rights reserved.</p>
    <script src="../Attribute/jquery/js/jquery-1.7.2.min.js" type="text/javascript"></script>
    <script>
        function resetTabs() {
            $("#content > div").hide(); //Hide all content
            $("#tabs a").attr("id", ""); //Reset id's      
        }

        var myUrl = window.location.href; //get URL
        var myUrlTab = myUrl.substring(myUrl.indexOf("#")); // For localhost/tabs.html#tab2, myUrlTab = #tab2     
        var myUrlTabName = myUrlTab.substring(0, 4); // For the above example, myUrlTabName = #tab

        (function () {
            $("#content > div").hide(); // Initially hide all content
            //$("#tabs li:first a").attr("id", "current"); // Activate first tab
            //$("#t2").attr("id", "current"); // Activate first tab
            //$("#content > div:first").fadeIn(); // Show first tab content
            $("#tab1").fadeIn(); // Show first tab content

            $("#tabs a").on("click", function (e) {
                e.preventDefault();
                if ($(this).attr("id") == "current") { //detection for current tab
                    return
                }
                else {
                    resetTabs();
                    $(this).attr("id", "current"); // Activate this
                    $($(this).attr('name')).fadeIn(); // Show content for current tab
                }
            });

            for (i = 1; i <= $("#tabs li").length; i++) {
                if (myUrlTab == myUrlTabName + i) {
                    resetTabs();
                    $("a[name='" + myUrlTab + "']").attr("id", "current"); // Activate url tab
                    $(myUrlTab).fadeIn(); // Show url tab content        
                }
            }
        })()
    </script>
    </div>
</body>
</html>
